<template>
  <!--  inline-theme-disabled  cls-prefix="zll"-->
  <n-config-provider :locale="zhCN" :theme-overrides="themeOverrides" :date-locale="dateZhCN">
    <n-message-provider>
      <n-dialog-provider>
        <router-view />
      </n-dialog-provider>
    </n-message-provider>
  </n-config-provider>


  <div class="loading-global" v-if="loading">
    <Loading type="global" />
  </div>
</template>
<script setup>
import { ref, inject, onMounted, onBeforeUnmount } from 'vue'
import { NConfigProvider, NMessageProvider, zhCN, dateZhCN, NDialogProvider } from 'naive-ui'
import Loading from '@/components/Loading.vue'
// 防抖 确保函数在最后一次事件触发后的延迟执行
// import { debounce } from "lodash";
// 节流 在每个时间间隔的开始时被调用一次
// import { throttle } from "lodash";
// 深拷贝
// import { cloneDeep } from "lodash"
// import { useStore } from "vuex";

const global = inject('global')

const theme = global.$store.state.theme

const themeOverrides = {
  common: {
    // successColor: theme.color0,
    // successColorHover: theme.color2,
    // // successColorPressed: "#682CFFFF",
    // successColorSuppl: theme.suppl,

    primaryColor: theme.color0,
    primaryColorHover: theme.color1,
    primaryColorPressed: theme.color0,
    primaryColorSuppl: theme.color0,

  },
  Progress: {
    fillColor: theme.color0,

  },
  Popover: {
    borderRadius: theme.borrad,
  }
  // Button: {
  //   primaryColor: "#7a46fc",
  // },
  // Select: {
  //   peers: {
  //     InternalSelection: {
  //       primaryColor: "#000",
  //     },
  //   },
  // },
}

// const store = useStore();
// const { setStorage } = global.$storage;
// const store = 
// store.state.markKey = getStorage("mark-key") || "";
// store.state.tabType = getStorage("tab-type") || "";

const loading = ref(false)
const handleLoading = (val) => {
  loading.value = val
}

// onMounted(() => {
//  let as = document.querySelector('body')

//  console.log(document.querySelector(as));
// })

onMounted(async () => {

  // 获取根元素
  const root = document.documentElement;
  // 设置 :root 样式变量 
  for (const key in theme) {
    root.style.setProperty(`--zll-${key}`, theme[key]);
  }


  // // 开启自动同步
  if (global.$store.state.isApp) {
    //   // 初始化文件夹监听
    global.$store.dispatch('initOnNoteApi')
  }
})

global.$mitt.on('loading', handleLoading)
onBeforeUnmount(() => {
  global.$mitt.off('loading', handleLoading)
})
</script>
<style lang="less" scoped>
.loading-global {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
</style>
